<template>
	<view>
		<!-- 公共组件-每个页面必须引入 -->
		<public-module></public-module>
			<!--view class="u-padding-20">
				<u-button type="primary"
				@click="$Router.push({path: '/pages/componentsC/shop/storemanage/shopedit', query: {shop_id: ''}})">
				创建
				</u-button>
			</view-->
			
			<u-empty text="您还没有开店" mode="data" icon="https://i.yodin.com/storage/empty/data.png" :show="flow_list.length === 0" v-if="loadstatus==false"></u-empty>
		<view  class="u-p-t-10" v-if="flow_list.length>0">
			<view class="b-b"></view>
			<view v-for="(item, index) in flow_list" :key="index">
				<view class="news" >
				
				<view class="newspic">
					<view class="tag">
					 <text class="">{{item.orderType_txt}}</text>
					 <text class="u-m-l-10 u-primary" v-if="item.is_rec==1">推荐中</text>
					</view>
					<view class="logo">
						<u--image :src="item.cover_url" width="60px" height="60px" mode="widthFix" radius="12rpx"></u--image>
					</view>
					<view class="titlebg">
						<view>
							<dd class="u-line-1"> {{item.name}}</dd>
						</view>
					</view>
				</view>

				<u-gap height="10"></u-gap>
				<u-grid :col="5" :border="false">
					<u-grid-item
					 @click="$tools.goJump('/pagesPackageA/storemanage/goodsmanage',{shop_id: item.shop_id},!userInfo.token,'')">
						<u-icon name="goods_light" custom-prefix="iconfont" size="30"></u-icon>
						<view class="u-font-xs u-m-t-10">商品</view>
					</u-grid-item>

					<u-grid-item
					@click="$tools.goJump('/pagesPackageA/storemanage/ordermanage',{shop_id: item.shop_id},!userInfo.token,'')">
						<u-icon name="f1" custom-prefix="iconfont" size="30"></u-icon>
						<view class="u-font-xs u-m-t-10">订单</view>
					</u-grid-item>
					<u-grid-item
					 @click="$tools.goJump('/pagesPackageA/storemanage/staffmanage',{shop_id: item.shop_id},!userInfo.token,'')">
						<u-icon name="jiaosequnti" custom-prefix="iconfont" size="30"></u-icon>
						<view class="u-font-xs u-m-t-10">管理者</view>
					</u-grid-item>
					
					<u-grid-item
					 @click="$tools.goJump('/pagesPackageA/storemanage/shopedit',{shop_id: item.shop_id},!userInfo.token,'')">
						<u-icon name="chanpinliebiaopubuliumoshi" custom-prefix="iconfont" size="30"></u-icon>
						<view class="u-font-xs u-m-t-10">设置</view>
					</u-grid-item>
					<u-grid-item
					 @click="runc(item.shop_id)" v-if="item.is_disable==0">
						<u-icon name="dianpu" custom-prefix="iconfont" size="30" color="#5ac725"></u-icon>
						<view class="u-font-xs u-m-t-10 u-success">启用中</view>					</u-grid-item>
					<u-grid-item @click="runc(item.shop_id)" v-else>
						<u-icon name="close" custom-prefix="iconfont" size="30" color="#c4c6c9"></u-icon>
						<view class="u-font-xs u-m-t-10 u-info-disabled">关闭态</view>
					</u-grid-item>
				</u-grid>

				</view>
				<view class="b-b u-m-b-20"></view>
			
			</view>


		<u-loadmore nomoreText="End" color="#dddddd" marginBottom="50" marginTop="50" :status="loadStatus" @loadmore="getflowlist" line></u-loadmore>
		</view>

		<u-gap height="70"></u-gap>
	
		
	</view>
</template>

<script>
import { mapState, mapMutations } from "vuex";
import { api_storemanage_shoplist,api_store_run } from '@/config/api.js';
import fNavbar from '@/components/module/f-navbar/f-navbar';
export default {
    components:{
        fNavbar
    },
	data() {
		return {
			flow_list:[],
			loadStatus: 'loadmore',
			loadstatus:true,
			loadstxt:'loading...',
			page:1,
			tid:98,
		};
	},
  computed: {
    ...mapState(["userInfo"]),
  },
	onPullDownRefresh() {
			this.flow_list = [];
			this.page=1;
			this.getflowlist();

		setTimeout(() => {
			uni.stopPullDownRefresh();
		}, 500);
			
		},
	async onLoad(){
		
        this.getflowlist();

	},
	onReachBottom() {
		setTimeout(() => {
			if (this.loadStatus=='loadmore')this.getflowlist();
		}, 500);
	},
	methods: {
		getflowlist(){
			this.loadstatus=true;
			api_storemanage_shoplist({
				page:this.page,
				limit:10,
				viewtype:'manage',
				see_uid: this.userInfo.member_id,
			}).then(res => {
				console.log(res)
				this.loadstatus = false;
				if (res.count > 0) {
					if (this.page <= res.pages) {
						res.list.map((item) => {
							this.flow_list.push(item);
						})
						if (this.page==res.pages)this.loadStatus = "nomore";
					  this.page += 1;
					} else {
					  this.loadStatus = "nomore";
					}
				}
			}).catch((e)=>{});
		},
	runc(shop_id){
        api_store_run({shop_id:shop_id}).then(res => {
				this.flow_list = [];
				this.page=1;
				this.getflowlist();
        }).catch((e)=>{});
	}
	},
};
</script>

<style lang="scss" scoped>

	.news{
		border: solid 0px #EAEEF1;
		
		padding: 20rpx;
		
		.newspic{
			width: 100%;
			height:240rpx;
			position: relative;
			background: #2979ff;
			border-radius: 20rpx;
			.tag{
				position: absolute;
				top:20rpx;
				right:20rpx;
				background: #67CF22;
				color: #FFFFFF;
				border-radius: 30rpx;
				padding: 4rpx 30rpx;
			}
		}
		
		.titlebg{
			position: absolute;
			bottom: 0px;
			width: 100%;
			font-weight: bold; font-style: normal;
			font-size: 30rpx;
			background: linear-gradient(96.25deg, #3338DD 20.55%, #2979ff 78.85%);
			border-radius: 0rpx 0rpx 20rpx 20rpx;
			padding:10px 2% 10px 2%;
			color: #f3f4f6;

		}
		.logo{
			position: absolute;top: 10px;left:10px;
			width:60px;height: 60px;background: #ffffff;border-radius: 10px;
		}
	}
	
</style>
